layui.define(['jquery', 'upload', 'layer', 'md5', 'form'], function (exports) {
    const {jquery: $, upload, layer, md5, form} = layui;

    const Utils = {
        getOssStsToken: function () {
            return new Promise(function (resolve, reject) {
                $.ajax({
                    url: "xxx",
                    dataType:"JSON",
                    success: function (res) {
                        resolve(res.data);
                    },
                    error: function (xhr) {
                        layer.msg("服务器异常，请稍后重试");
                        reject();
                    }
                })
            });
        },
    }

    exports("alioss_file_uploader", {
        render: function (data) {
            var status_string = data.value ? "已上传" : "未上传";
            $(data.elem).html(`
                 <div class="layui-form-item">
                    <label class="layui-form-label">${data.title}</label>
                    <div class="layui-input-inline" style="min-width: 200px;">
                        <input type="hidden" name="${data.name}" value="${data.value}" class="field-${data.name}">
                        <button type="button" class="layui-btn layui-btn-normal" id="${data.name}Button">文件上传</button>
                        <br>
                        <p style="font-size: 12px;margin-top:10px;" id="${data.name}_preview">${status_string}</p>
                        <br><br>
         
                    </div>
                    <div class="layui-form-mid layui-word-aux">${data.desc||''}</div>
                </div>
                `);


            var uploadRender = upload.render({
                elem: '#' + data.name + "Button",
                auto: false,
                accept: "file",
                exts: data.ext,
                choose: function (obj) {
                    var load = layer.load();
                    Utils.getOssStsToken().then(function (sts) {
                        uploadRender.config.elem.next()[0].value = '';
                        obj.preview(function (index, file, result1) {
                            layer.close(load);
                            let storeAs = Date.now() + '_' + md5.exec(file.name) + '.' + file.name.split('.').pop();//设置上传的文件名
                            let client = new OSS({
                                accessKeyId: sts.AccessKeyId,
                                accessKeySecret: sts.AccessKeySecret,
                                stsToken: sts.SecurityToken,
                                // region表示您申请OSS服务所在的地域，例如oss-cn-hangzhou。
                                region: sts.Region,
                                bucket: sts.Bucket
                            });

                            client.multipartUpload(storeAs, file, {
                                progress: function (p, checkpoint) {
                                    layui.element.progress(data.name + '_progress', (p * 100) + '%'); //可配合 layui 进度条元素使用

                                    if (p == 1) {
                                        layer.msg(data.title + "上传成功");
                                        var src = sts.Host + '/' + storeAs;
                                        setTimeout(function () {
                                            $('#' + data.name + '_preview').text("上传成功");
                                        }, 1000);
                                        $("[name=" + data.name + "]").val(src);
                                    }
                                }
                            });
                        });
                    });
                }
            })
        }
    })
});